import Taro, { Component } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
// import { TopBar } from 'taro_widgets'
import './index.scss'
import TopBar from '../../components/topbar/topbar'
import NetStatus from '../../components/netstatus/netstatus'
import Divider from '../../components/divider/divider'
import Nothing from '../../components/nothing/nothing'
import SearchView from '../../components/search_view/search_view'
import Skeyboard from '../../components/skeyboard/skeyboard'
import MyTips from '../../components/tips/tips'
import CurtainRadio from '../../components/curtain/curtainRadio/curtainRadio'

export default class Index extends Component {

  config = {
    navigationBarTitleText: '',
    navigationBarStyle: 'custom'
  }

  constructor(props){
    super(props)
    this.state = {
      tipShow : false,
    }
    this.hide = this.hide.bind(this)
    this.show = this.show.bind(this)
    this.onChange = this.onChange.bind(this)
  }

  show(){
    this.setState({tipShow:true})
  }

  hide(){
    this.setState({tipShow:false})
  }

  onChange(){
    console.log('change')
  }


  render () {
    const tipShow = this.state.tipShow
    return (
      <View className='index'>
        <TopBar title='首页' hasBackIcon></TopBar>
        <NetStatus></NetStatus>
        <SearchView></SearchView>
        <Nothing></Nothing>
        <Divider></Divider>
        <Skeyboard></Skeyboard>
        {/* <TopBar title='首页' hasBackIcon></TopBar>
        <Text onClick={this.show}>显示Tip</Text>
        <CurtainRadio
          groupName='fromType'
          tipShow={tipShow}
          dataList={[{text:'PC',value:'PC',checked:false},{text:'APP',value:'APP',checked:false},{text:'H5',value:'H5',checked:false}]}
          onHideTip={()=>this.hide}
          onChange={()=>this.onChange}
        ></CurtainRadio> */}
        <MyTips title='简介' tipShow textArr={['Taro 是一套遵循 React 语法规范的 多端开发 解决方案。',
        '现如今市面上端的形态多种多样，Web、React-Native、微信小程序等各种端大行其道，当业务要求同时在不同的端都要求有所表现的时候，针对不同的端去编写多套代码的成本显然非常高，这时候只编写一套代码就能够适配到多端的能力就显得极为需要。',
        '使用 Taro，我们可以只书写一套代码，再通过 Taro 的编译工具，将源代码分别编译出可以在不同端（微信 / 京东 / 百度 / 支付宝 / 字节跳动 小程序、快应用、H5、React-Native 等）运行的代码。'
        ]}
        >
        </MyTips>
      </View>
    )
  }
}
